Working with Font Properties
The font properties allow you to set font-related styles for the text present on an HTML Web page. You can apply the font properties by defining the font-family, font-size, and the style of the text.
Given below lists the available font properties:
Property |
Description |
---|---|
font |
Defines a shorthand property for font-style, font-variant, font-weight, font-size, line-height, and font-family properties. It sets all these font properties in one declaration; in CSS2, you can also set this property to caption, icon, menu, message-box, small-caption, or status-bar |
Specifies a prioritized list of font family names and/or generic family names for an element. Generic families refer to the font characteristics the browser should try to match, such as serif or monospace. |
|
Specifies the size of a font. You can set this property to xx-small, x-small, small, medium, large, x-large, xx-large, smaller, larger, or specify it in the form of a length or percentage value. |
|
font-stretch |
Specifies a normal, condensed, or extended font face. You can set this property to normal, wider, narrower, ultra-condensed, extra-condensed, condensed, semi-condensed, semi-expanded, expanded, extra-expanded, or ultra-expanded. |
Specifies the style of the font. You can set this property to normal, italic, or oblique. |
|
font-variant |
Specifies whether or not a font is a small-caps font. You can set this property to either normal or small-caps. |
Specifies the weight of the font. You can set this property to normal, bold, bolder, lighter, 100, 200, 300, 400, 500, 600, 700, 800 or 900. |
Let’s now learn how to work with the font properties, including font-family, font-size, font-style, and font-weight.